<template>
<div class="page" data-page="unitInspectInfo" style="z-index: 2;">
	<div class="navbar line-subnavbar">
		<div class="navbar-inner">
			<div class="left">
				<a class="link back" data-view=".view-main" href="/home/"> <i
					class="icon icon-back"></i> <span class="ios-only">Back</span>
				</a>
			</div>
			<div class="title sliding">本期巡检</div>
		</div>
        <div class="navbar" style="top: 56px;height: 40px;background: #fff;color: #666666;">
                <div class="content-block myBlock">
                    <div class="row troubleApply-type">
                        <div id="tb-inspectUnit-unfinish" class="col">未完成单位</div>
                        <div id="tb-inspectUnit-finish" class="col select">已完成单位</div>
                    </div>
                </div>
            </div>
	</div>
      <div class="page-content infinite-scroll-content">
            <div class="content-block">
                <div class="divide-gray mt40"></div>
                <!-- 未完成单位 s-->
                <div class="troubleApply-tab-con" style="display: block">
                        <ul class="realSafety-more" id="finish-unit-list">
                            
                        </ul>
                </div>
                <!-- 已完成单位 -->
                 <div class="troubleApply-tab-con">
                        <ul class="realSafety-more" id="unfinish-unit-list">
                            
                        </ul>
                </div>
            </div>
            </div>
        </div>
</div>
</template>
<style scoped>
	#unitSafetyMore ul:before{
		height: 0px;
	}
	#unitSafetyMore ul:after{
		height: 0px;
	}
.search_top {
	margin-top: 50px;
	width: 100%;
	height: 50px;
	background-color: #fff;
	box-shadow: 1px 1px 11px 1px #cecdcd;
	position: fixed;
	z-index: 3;
}

.title {
	padding-right: 56px;
	margin: 0px auto;
}

.md .list ul:before {
	height: 0px !important;
	width: 0px !important;
}

.md .list ul:after {
	height: 0px !important;
	width: 0px !important;
}

.safetUnitName {
	display: inline-block;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	font-size: 13px;
}

.column {
	height: 7px;
	margin-top: 8px;
	border-top-left-radius: 0px;
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
	border-bottom-left-radius: 0px;
}

.pxbtnpic {
	float: right;
	margin-top: 14px;
	width: 20px;
	margin-right: 29px;
}

.column_num {
	font-size: 13px;
	color: #666666;
}
</style>
<script>
    return {
        mounted() {
            var self = this;
            self.id_org = userInfor.organizationIds;
            self.status = self.$route.params.tabID;
            $(".troubleApply-type .col").removeClass('select').eq((self.status)).addClass('select');
            jQuery(".troubleApply-tab-con").eq(self.status).show().siblings(".troubleApply-tab-con").hide();
            self.getInspectUnitList();//获取巡检单位
        },
        data: function () {
            return {
                status:0,
                list:[],
            }
        },

        methods: {
            //刷新
            refreshFirstRank: function (e, done) {
                if (done && e) {
                    var self = this;
                    var $ = self.$$;
                    setTimeout(function () {                    	
                        $("#unitSafetyMore ul").empty();
                        self.getInspectUnitList();
                        done();
                    }, 1000);
                }
            },
            getInspectUnitList: function () {
            	var self = this;
                var $ = self.$$;
                var id_org="";
                if (single_Orgid == "") {
                    id_org=userInfor.organizationIds;
                } else {
                    id_org=single_Orgid;
                }
                Dao.getNewTodayInspectCountDetail({
                    userName: userInfor.accountName,
                    eviceId: appKeyObj.deviceId,
                    orgIds:id_org,
                    status:self.status==0?0:1
                },function (data) {
                 self.list=data;
                 self.datalist(data);
                },true);
            },
            datalist :function (data) {
                var self = this;
                if(data&& data.length>0){
                    for (var i = 0; i < data.length; i++) {
                    if (self.status ==0){
                        $("#finish-unit-list").append(`<li class="clearfix">
                            <div class="left-img"><img src="`+common.transNullundefined(data[i].orgLogo)+`"></div>
                            <div class="right-block">
                                <p class="p-top clearfix">
                                    <span style="padding-top:6px;font-size:16px;">` + common.transNullundefined(data[i].orgName) + `</span>
                                </p>
                            </div>
                        </li>`);      
                    }else if(self.status == 1){
                        let rate=(data[i].completedTaskNum/data[i].total);
                        $("#unfinish-unit-list").append(`<li class="clearfix">
                            <div class="left-img"><img src="`+common.transNullundefined(data[i].orgLogo)+`"></div>
                            <div class="right-block">
                                <p class="p-top clearfix">
                                    <span style="padding-top:6px;font-size:16px;">` + common.transNullundefined(data[i].orgName) + `</span>
                                </p>
                            </div>
                        </li>`);
                       
                        }
                    }
                }else{
                    if (self.status ==0){
                        $("#finish-unit-list").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                    }else{
                        $("#unfinish-unit-list").append(`<div class="no-data-img"><img src="`+listNoDataPic()+`"/></div>`);
                    }
                    
                }
                
            }
        },
        on: {
            pageInit: function (e, page) {
                var self = this;
                var app = self.$app;
                var $ = self.$$;
                jQuery(".troubleApply-type .col").click(function(e) {
                    var tab_index = jQuery(".troubleApply-type .col").index(e.currentTarget);
                    jQuery(e.currentTarget).addClass("select").siblings().removeClass("select");
                    jQuery(".troubleApply-tab-con").eq(tab_index).show().siblings(".troubleApply-tab-con").hide();
                    if (tab_index == 0) {
                        self.status = 0;
                        $("#finish-unit-list").empty();
                        $("#unfinish-unit-list").empty();
                    } else if (tab_index == 1) {
                        self.status = 1;
                        $("#finish-unit-list").empty();
                        $("#unfinish-unit-list").empty();
                    } 
                    self.getInspectUnitList();
                })       
            }
        }
    }
</script>